import Image from "next/image"
import { ReactNode } from "react"


type LessonBlockProps = {
    content: ReactNode,
    controlBar?: ReactNode
}

export default function LessonBlock(props: LessonBlockProps) {
    return (
        <>
            <div className='p-5 my-4 border-y border-dashed border-black'>
                {!!props.controlBar &&
                    <div className='flex justify-end gap-4'>
                        {props.controlBar}
                    </div>
                }
                <div className='w-full flex justify-center'>
                    <div className='text-center w-1/2 font-sans text-[14pt]'>
                        {props.content}
                    </div>
                </div>
            </div>
        </>
    )
}
